<template>

	<view>
		<bg-video></bg-video>
		<cu-custom bgColor="bg-main" :isBack="true">
			<block class="text-white" slot="content">奖励列表</block>
		</cu-custom>
		<view>
			<view class="padding-sm">
				<view v-for="(fx,index) in afxjls" :key="index">
					<view class="margin-sm shadow bg-white flex justify-start">
						<view class="w-25 padding-xs">
							<view class="bg-pink">
								<view class="text-center padding-xs">开课老师</view>
								<view class="flex justify-center flex-direction align-center">
									<view class="cu-avatar xl round"
										:style="'background-image:url('+fx.jcover+');'"></view>
									<view class="padding-sm">{{fx.jlname}}</view>
								</view>
							</view>
						</view>
						<view class="w-25 padding-xs">
							<view class="bg-brown">
								<view class="text-center padding-xs">奖励来源</view>
								<view class="flex justify-center flex-direction align-center">
									<view class="cu-avatar xl round"
										:style="'background-image:url('+fx.fheadimg+');'"></view>
									<view class="padding-sm">{{fx.fnc}}</view>
								</view>
							</view>
						</view>
						
						<view class="w-50 padding-xs flex justify-between flex-direction">
							<view class="flex justify-end">
								<view class="text-green" v-if="fx.stu == 'T'">同意</view>
								<view class="text-red" v-else-if="fx.stu == 'J'">不同意</view>
							</view>
							<view class="flex justify-end">
								<view>{{fx.ct}}</view>
							</view>
							<view class="flex justify-end">
								<view class="text-grey">来源金额：{{fx.amount}}</view>
							</view>
							<view class="flex justify-end">
								<view class="text-grey">奖励比例：{{fx.tqper}}</view>
							</view>
							<view class="flex justify-end">
								<view class="text-orange">奖励金额：{{fx.fxje}}</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
		
		<view v-if="afxjls.length < pageInfo.total" class="padding">
			<button @click="loadMore" class="cu-btn block bg-main lg">显示更多</button>
		</view>
		
		<view v-if="afxjls.length == 0" class="padding text-center">
			<text>暂无记录</text>
		</view>
	</view>
</template>

<script>
	export default {
		data: function() {
			return {
				clientid: this.store.state.client.clientid,
				afxjls: [],
				pageInfo: {
					current: 1,
					total: 0,
					size: 5
				}
			}
		},
		onLoad: function(){
			console.log(this.clientid);
			this.loadFx();
		},
		onShareAppMessage: function(){
			return {
				title: this.store.state.title,
				path: '/pages/first?id='+this.store.state.client.clientid
			}
		},
		methods: {
			loadFx: function(){
				this.api("/client/fxjl/page").send({
					current: this.pageInfo.current,
					size: this.pageInfo.size,
					fxclientid: this.clientid
				}).then(data => {
					this.pageInfo.total = data.afxjls.total
					for (let index in data.afxjls.records) {
						let record = data.afxjls.records[index];
						this.afxjls.push(record);
					}
				});
			},
			loadMore: function(){
				this.pageInfo.current++;
				this.loadFx();
			}
			
		}
	}
</script>

<style>
</style>